<template>
  <a-config-provider :locale="locale">
    <div id="app">
      <router-view/>
    </div>
  </a-config-provider>
</template>
<script>
  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
  import enquireScreen from '@/utils/device'

  export default {
    data () {
      return {
        locale: zhCN,
      }
    },
    created () {
      let that = this
      enquireScreen(deviceType => {
        // tablet
        if (deviceType === 0) {
          that.$store.commit('TOGGLE_DEVICE', 'mobile')
          that.$store.dispatch('setSidebar', false)
        }
        // mobile
        else if (deviceType === 1) {
          that.$store.commit('TOGGLE_DEVICE', 'mobile')
          that.$store.dispatch('setSidebar', false)
        }
        else {
          that.$store.commit('TOGGLE_DEVICE', 'desktop')
          that.$store.dispatch('setSidebar', true)
        }

      })
    }
  }
</script>
<style>
  #app {
    height: 100%;
  }
  .ant-table{
    font-size: 12px !important;
  }
  .ant-tabs-bar{
    margin: 0 !important;
  }
 .ant-btn{
    font-size: 12px !important;
    /*padding: 0px 10px !important;*/
    /*height: 26px !important;*/
  }
  .footer{
    margin: 24px 0 10px !important;
  }
  .tab-layout-tabs.ant-tabs{
    font-size: 12px !important;
  }
  input{
    font-size: 12px !important;
  }
  .ant-layout-sider-children{
    font-size: 12px !important;
  }
  .ant-table-pagination.ant-pagination{
    margin: 4px 0 !important;
  }
  .layout .top-nav-header-index.light{
    background-color: #D7D7D7 !important;
  }
  .layout .top-nav-header-index .header-index-wide .ant-menu.ant-menu-horizontal{
    background-color: #D7D7D7;
  }
 .sider.light .logo{
  background-color: #D7D7D7 !important;;
 }
 .sider .logo h1{
  color: rgba(0,0,0,.65) !important;
 }
.layout .header{
  background-color: #D7D7D7 !important;
  color: rgba(0,0,0,.65) !important;
}


</style>